<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <button onclick="dian()">点我</button>
    <h3 id="result"></h3>
    <script>
       /* 会话就是保持浏览器不要关闭，关闭等同于结束了一次会话，重新开启等同于创建了一次会话 */
       //1.保存数据
       sessionStorage.setItem("name","kaly");

       //2.提取数据
       var lastname = sessionStorage.getItem("name");

       //3.删除指定键的数据
       sessionStorage.removeItem("name");

       //4.删除所有数据
       sessionStorage.clear();

       /* 案例：记录点击了几下按钮 */
       function dian(){
            if(sessionStorage.getItem("clickCount")){
                sessionStorage.setItem("clickCount",
            Number(sessionStorage.getItem("clickCount")) + 1);
           }else{
                sessionStorage.setItem("clickCount",1);
           }
        
           document.getElementById("result").innerHTML = "已经点击了"+
        sessionStorage.getItem("clickCount")+"次！";
         
       }
    </script>
</body>
</html>